<template>
	<view>
		<!-- 门诊病历 -->
		<UserInfoCardVue></UserInfoCardVue>
		<view class="record-container">
			<filter-button :date-filters="dateFilters" :active-date="activeDate" :is-record="isRecord"
				:selected-time-range="selectedTimeRange" @updateActiveDate="updateActiveDate"
				@time-range-selected="handleTimeRangeSelected" />

			<record-card :record-infos="originalRecordList"></record-card>
		</view>
	</view>
</template>

<script>
	import FilterButton from './components/filterButton.vue';
	import recordCard from './components/Record/recordCard.vue';
	import UserInfoCardVue from '../../../components/UserInfo/UserInfoCard.vue';
	import {
		patientMedicalRecordReport
	} from '../../../api/patientMedicalRecord';
	import {
		mapGetters
	} from 'vuex'
	import {
		dateFormat,
		getPastDate
	} from '../../../utils/assist';
	export default {
		components: {
			UserInfoCardVue,
			FilterButton,
			recordCard
		},
		computed: {
			...mapGetters([
				'userInfo'
			]),
		},
		data() {
			return {
				dateFilters: [{
						label: '一月内',
						value: '1m'
					},
					{
						label: '半年内',
						value: '6m'
					},
					{
						label: '一年内',
						value: '1y'
					},
					// {
					// 	label: '全部',
					// 	value: 'all'
					// },
				],
				activeDate: '1m',
				isRecord: true,
				selectedTimeRange: '请选择时间范围',
				originalRecordList: [],
				beginTime: '',
				endTime: "",
			}
		},
		mounted() {
			this.setSelectDate()
			this.init()
		},
		methods: {
			init() {
				patientMedicalRecordReport({
					cardType: "8",
					cardNo: this.userInfo.patId,
					beginDate: this.beginTime,
					endDate: this.endTime
				}).then(res => {
					console.log(res)
					if (res.length > 0) {
						this.originalRecordList = res;
					}
				})
			},
			handleTimeRangeSelected(e) {
				this.beginTime = e.startDate;
				this.endTime = e.endDate
				this.init();
			},
			updateActiveDate(value) {
				this.activeDate = value;
				this.setSelectDate()
				this.init();
			},
			setSelectDate() {
				this.endTime = dateFormat('yyyy-MM-dd', new Date())
				switch (this.activeDate) {
					case '1m':
						this.beginTime = getPastDate(1, 'month')
						break;
					case '6m':
						this.beginTime = getPastDate(6, 'month')
						break;
					case '1y':
						this.beginTime = getPastDate(12, 'month')
						break;
					case 'all':
						this.beginTime = getPastDate(120, 'month')
						break;
					default:
						// timeMatch = true;
				}
				this.beginTime = dateFormat(('yyyy-MM-dd'), new Date(this.beginTime))
			},
		}
	}
</script>

<style lang="scss" scoped>
	.record-container {
		min-height: 100vh;
		// padding: 20rpx;
	}
</style>